@import "../../../styles.less";

.demo-page {
  padding : 0px;
  height  : 100%-6px;
  width   : 100%;
  top     : 50px;
  position: absolute;
}

::ng-deep .ngx-json-viewer {
  overflow: hidden !important;
}

.title-fieldset {
  font-size  : 16px;
  font-weight: 600;
  border     : none;
  margin-top : 20px;
  padding    : 0;
}

.tool-bar-button {
  margin          : 8px 4px 0 4px;
  padding         : 4px 12px 4px 12px;
  color           : @black;
  letter-spacing  : 0;
  text-align      : center;
  line-height     : 18px;
  background-color: #fff;
  border          : 1px solid @light-grey;
  border-radius   : 2px;
}

.app-ace-editor {
  border    : 2px solid @lightest-grey;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.tasklist-search-box-block {
  display: inline-block;
  margin : 10px;
}

.tasklist-search-box-div {
  display        : flex;
  justify-content: space-between;
  align-items    : center;
}

.delete-button:hover {
  border        : none;
  padding       : 0;
  margin        : 0;
  font-size     : 12px;
  color         : #526ECC;
  letter-spacing: 0;
  line-height   : 18px;
  cursor        : pointer;
}

.bar {
  display: inline-block;
}

.left-bar {
  .bar();
  width: 90%;

  .method-select {
    display: inline-block;
    width  : 96px;
  }

  .url-input {
    display: inline-block;
    width  : 700px;
    margin : 0 4px 2px 4px;
  }
}

.right-bar {
  .bar();
  width: 10%;

  .button {
    width      : 100%;
    right      : 0;
    line-height: 18px;
  }
}

.template-select {
  display: inline-block;
  width  : 800px
}

.font-bar {
  font-size: 18px;
  color    : dodgerblue;
  cursor   : pointer;
  margin   : 0 4px 0 4px
}

.block {
  width      : 50%;
  height     : 100%;
  margin     : 40px;
  border     : 1px solid black;
  position   : relative;
  align-items: stretch;
}

.left-block {
  .block();
  display: flex;
  align-items: center;
  justify-content: center;

  .input-block {
    width         : 100%;
  }

  .input-button{
    background-color: #f0f0f0;
    font-family: inherit;
    font-size: 100%;
    line-height: 1.5;
    margin: 0;
    border: 1px solid rgb(118, 118, 118);
    width:  64px;
    border-radius: 2px;
    text-align: center;
    margin-top: 40px
  }
}

.right-block {
  .block();
  display: inline-block;
}
